<style>
	@import url("../../../common/css/order.css");
</style>
<template>
	<view>
		<commonHeader :titleName="titleName"></commonHeader>
		<view class="content_main_nav">
			<view class="help_shop">
				<span class="help_title">帮帮我</span>
				<textarea class="buy_goods" style="max-height: 240rpx;" auto-height="true" v-model="goodsStr" placeholder="请输入要服务的项目" />
			</view>
			<view class="address_info">
				<view class="receive">
					<image src="../../../static/receive.png" mode="aspectFill"></image>
					<view class="receive_info">
						<span class="address">{{shippingInfo.detailedAddress}}</span>
						<span class="user_info">{{shippingInfo.contacts}} {{shippingInfo.contactPhone}} </span>
					</view>
					<view class="edit_address" @click="goToEditAddress">修改</view>
				</view>
			</view>
			<view class="serviceDate">
				<view class="service_date">
					<view class="service_date_left">送达时间</view>
					<view class="service_date_right" v-if="chooseDateIndex != 0">
						<text>{{selectDateStr}}</text>
						<!-- <image class="s_svg" src="../../../static/reback.png" mode="aspectFill"></image> -->
					</view>
				</view>
				<view class="choose_date">
					<view class="choose_date_li" 
					v-for="(item,index) in dateList"
					:key="index"
					@click="chooseDate(item,index)" 
					:class="[chooseDateIndex == item.id ? 'active' : '']">
						
						<view v-if="item.id == -1">
							<timePicker
								ref="times"
							    showType="hourToMinutes"
							    @btnConfirm="btnConfirm" 
							    @btnCancel="btnCancel"
							>
							{{item.name}}
							</timePicker>
						</view>
						<view v-else>{{item.name}}</view>
					</view>
					
				
				</view>
				<view class="leaveMessage">
					<span>留言</span>
					<textarea class="leaveText" v-model="leaveText" placeholder="留言给商家"></textarea>
				</view>
			</view>
			<view class="order_price">
				<view class="price_info">
					<text class="price_title">跑腿费</text>
					<text class="price_money" v-if="userVipInfo.id != -1 && userVipInfo.usageTimes > 0 ">本次使用1张跑腿卡,还剩{{userVipInfo.usageTimes - 1}}张</text>
					<text class="price_money" v-else >￥{{paotui_price}}</text>
				</view>
			</view>
			<view class="payImmediately">
				<view class="pay_price">
					<span class="price_total">合计：</span>
					<span class="price_money">￥{{paotui_price}}</span>
				</view>
				<view class="pay_btn" @click="payOrder">
					立即支付
				</view>
			</view>
		</view>
		
			
		
	</view>	
</template>

<script>
	import commonHeader from '@/components/common-header/common_header_title.vue';
	import timePicker from '@/components/wing-time-selector/wing-time-selector.vue';
	export default {
		components:{
			commonHeader,timePicker
		},
		data() {
			return {
				titleName:'跑跑帮我买',
				leaveText:'',
				goodsStr:'',
				chooseDateIndex:0,
				dateList:[],
				selectDateStr:'',
				selectDate:0,
				pDay:0,
				pHour:0,
				pMinute:0,
				shippingInfo:{},//配送信息
				paotui_price:0,
				userVipInfo:{}
			}
		},
		onLoad(e) {
			this.getDateInfo()
			this.getUserVipInfo()
		},
		onShow(){
			this.getDefaultAddress()
		},
		methods: {
			getNDay(day) {
				var today = new Date();　　
				var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;　　
				today.setTime(targetday_milliseconds); //注意，这行是关键代码
				　　
				var tYear = today.getFullYear();　　
				var tMonth = today.getMonth();　　
				var tDate = today.getDate();　　
				tMonth = this.doHandleMonth(tMonth + 1);　　
				tDate = this.doHandleMonth(tDate);　　
				return tYear + "-" + tMonth + "-" + tDate;
			},
			getDateInfo(){
				let that = this
				this.$api.order.payOrderList()
				.then(res => {
					if(res.code == 200){
						that.dateList = res.data
						that.dateList.push(yyps)
					}else{
						this.$commonJs.showToast.showNoneToast(res.msg)
					}
				})
				.catch(err => {
					this.$commonJs.showToast.showNoneToast(err)
				})
			},
			getUserVipInfo(){
				let that = this
				this.$api.vip.getVipInfo()
				.then(res => {
					console.log(res)
					if(res.code == 200){
						console.log(res.data)
						that.userVipInfo = res.data
					}else{
						this.$commonJs.showToast.showNoneToast(res.msg)
					}
				})
				.catch(err => {
					this.$commonJs.showToast.showNoneToast('会员卡信息有误，请联系工作人员')
				})
			},
			doHandleMonth(month) {　　
				var m = month;　　
				if (month.toString().length == 1) {　　
					m = "0" + month;　　
				}　　
				return m;
			},
			goToEditAddress(){
				this.$uniNavigateTo('../../../pages/address/address-list/address-list')
			},
			getDefaultAddress(){
				let that = this
				this.$api.address.userDefaultAddress()
				.then(res => {
					if(res.code == 200){
						let resData = res.data
						if(resData.length <= 0){
							//跳转地址
							this.$commonJs.waitFunction.waitNavigateTo('请先设置收货地址','../../../pages/address/address-list/address-list')
						}else{
							that.shippingInfo = resData[0]
						}
					}else{
						this.$commonJs.showToast.showNoneToast(res.msg)
					}
				})
				.catch(err => {
					this.$commonJs.showToast.showNoneToast(err)
				})
			},
			chooseDate(e,index){
				let that = this
				that.chooseDateIndex = e.id
				if(that.userVipInfo.id == -1 || that.userVipInfo.usageTimes <= 0){
					that.paotui_price = e.amount
				}
				if(that.chooseDateIndex != -1){
					that.selectDateStr = e.name
					that.selectDate = that.getNDay(0)
				}
			},
			btnConfirm(e) {
				console.log(e)
				let that = this
				that.selectDateStr = e.key
				that.selectDate = e.year_date
				if(e.n_year == '今天'){
					that.pDay = 0
				}else if(e.n_year == '明天'){
					that.pDay = 1
				}else if(e.n_year == '后天'){
					that.pDay = 2
				}
				that.pHour = e.hour
				that.pMinute = e.minute
			},
			payOrder(){
				if(this.goodsStr == ''){
					this.$toast("请输入您的需求")
					return false
				}
				if(this.chooseDateIndex == 0){
					this.$toast("请选择送达时间");
					return false
				}
				let postData = {}
				if(this.chooseDateIndex == -1){
					postData = {cscId:this.$store.state.txMap.scsId,type:1,distributionType:this.chooseDateIndex,customTimeJson:{day:this.pDay,minute:this.pMinute,hour:this.pHour},addressId:this.shippingInfo.id,orderRemark:this.leaveText,customOrderInfo:this.goodsStr}
				}else{
					postData = {cscId:this.$store.state.txMap.scsId,type:1,distributionType:this.chooseDateIndex,addressId:this.shippingInfo.id,orderRemark:this.leaveText,customOrderInfo:this.goodsStr}
				}
				if(this.userVipInfo.id != -1 && this.userVipInfo.usageTimes > 0){
					this.$set(postData,'distfFeePaymentType',1)
					this.$set(postData,'userMembershipCardId',this.userVipInfo.id)
				}else{
					this.$set(postData,'distfFeePaymentType',0)
				}
				this.$api.order.payOrderAdd(postData)
				.then(res => {
					if(res.code == 200){
						//拉起支付
						console.log(res.data)
						if(res.data.isPay == '0'){
							this.$commonJs.waitFunction.waitRedirectTo(res.msg,'/pages/order/index')
						}else{
							this.$payCommon.xcxPay(res.data)
						}
					}else{
						this.$commonJs.showToast.showNoneToast(res.msg)
					}
				})
				.catch(err => {
					this.$commonJs.showToast.showNoneToast(err)
				})
			}
		}
	}
</script>
